import React from 'react'
import Lottie from 'react-lottie'
import * as animationData from '../../utils/data.json'

export default class LottieControl extends React.Component {
  constructor(props) {
    super(props)
    this.state = { isStopped: false, isPaused: false }
  }

  render() {
    const loadingPosition = {
      position: 'fixed',
      left: '50%',
      top: '50%',
      marginLeft: '-250px',
      marginTop: '-250px',
      zIndex: 999,
    }

    const defaultOptions = {
      loop: true,
      autoplay: true,
      animationData: animationData.default,
      rendererSettings: {
        preserveAspectRatio: 'xMidYMid slice',
      },
    }

    return (
      <div>
        <Lottie
          options={defaultOptions}
          height={400}
          width={400}
          style={loadingPosition}
          isStopped={this.props.loadingFlag}
        />
      </div>
    )
  }
}
